<template>
    <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
            <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
                v-hasPermi="['system:record:add']">新增</el-button>
        </el-col>
        <el-col :span="1.5">
            <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
                v-hasPermi="['system:record:edit']">修改</el-button>
        </el-col>
        <el-col :span="1.5">
            <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
                v-hasPermi="['system:record:remove']">删除</el-button>
        </el-col>
        <el-col :span="1.5">
            <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
                v-hasPermi="['system:record:export']">导出</el-button>
        </el-col>
        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
</template>

<script>
export default {
    name: "RecordToolbar",
    props: {
        // 非单个禁用
        single: {
            type: Boolean,
            default: true
        },
        // 非多个禁用
        multiple: {
            type: Boolean,
            default: true
        },
        // 显示搜索条件
        showSearch: {
            type: Boolean,
            default: true
        }
    },
    methods: {
        /** 新增按钮操作 */
        handleAdd() {
            this.$emit('add');
        },
        /** 修改按钮操作 */
        handleUpdate() {
            this.$emit('update');
        },
        /** 删除按钮操作 */
        handleDelete() {
            this.$emit('delete');
        },
        /** 导出按钮操作 */
        handleExport() {
            this.$emit('export');
        },
        /** 查询按钮操作 */
        getList() {
            this.$emit('query');
        }
    }
};
</script>

<style lang="scss" scoped>
.record-toolbar {
    .record-toolbar-button {
        margin-right: 10px;
    }
}
</style>